<template>
  <div class="inner-page">
    <div class="inner-page-title mb-30">
      <span>数据库备份TeleDB-DBS</span>
      <div class="fr">
        <span class="btn">演示动画</span>
        <span class="btn">产品试用</span>
      </div>
    </div>
    <div class="flex-row">
      <div class="left-row flex-1 pr-20">
        <div class="section-title">
          <svg-icon iconName="biaoti1" class="mr-10"></svg-icon>产品介绍
        </div>
        <div class="fs-14 f-normal mt-20 mb-20">
          数据库备份服务（简称DBS）是天翼云提供的低成本、高可靠的一站式数据备份和恢复服务管理平台。基于天翼云的云端存储支持，DBS支持无限容量存储。DBS支持MySQL、PostgreSQL等多种数据库备份，支持本地数据中心、其他云厂商、ECS数据库及RDS数据库等环境，是客户首选的易用好用的企业级混合云统一备份平台。
        </div>
        <div class="section-title">
          <svg-icon iconName="biaoti2" class="mr-10"></svg-icon>核心能力
        </div>
        <div class="flex-grid mt-20">
          <div class="list-box" v-for="(item, index) in list" :key="index">
            <div class="title">
              <span>{{ index + 1 }}</span> {{ item.name }}
            </div>
            <div class="mb-20">{{ item.label }}</div>
          </div>
        </div>
      </div>
      <div class="left-row flex-1 pl-20">
        <div class="section-title">
          <svg-icon iconName="biaoti3" class="mr-10"></svg-icon>应用场景
        </div>
        <el-tabs v-model="activeName" @tab-click="handleClick">
          <el-tab-pane
            :label="item.title"
            :name="item.num"
            v-for="(item, index) in tabList"
            :key="index"
          >
            <div class="list-box">
              <div class="title">
                <span>{{ index + 1 }}</span> {{ item.name }}
              </div>
              <div class="mb-20">{{ item.label }}</div>
            </div>
          </el-tab-pane>
        </el-tabs>
        <div class="section-title mt-20">
          <svg-icon iconName="biaoti3" class="mr-10"></svg-icon>产品功能架构
        </div>
        <div class="framework-img mt-20 bor">
          <img :src="frameworkImg" alt="" />
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'nav12',
  data () {
    return {
      activeName: '0',
      list: [
        { name: '低成本', label: '支持容量无限扩展的云端存储，按需付费。' },
        { name: '安全', label: '异地备份，支持多种加密方式进行传输存储加密。' },
        { name: '灵活易用', label: '细粒度备份，生命周期管理，历史记录展示。' },
        { name: '低RPO/RTO', label: '通过数据库日志解析同步技术，可将RPO/RTO降低至秒级。' }
      ],
      tabList: [
        {
          title: '场景1',
          num: '0',
          name: '不停机迁移',
          label:
            '由于合规要求，互联网金融、银行、保险等行业数据库除同城备份外，还需要异地备份。数据库备份 DBS可以帮助用户快速的为ECS自建库、RDS、本地IDC数据库进行异地备份，并通过天翼云云专线或公网将数据库实时备份到OSS上。'
        },
        {
          title: '场景2',
          num: '1',
          name: '异地备份场景',
          label:
            '由于业务迅速发展，企业对跨云备份需求越来越明显。云数据库备份DBS提供将其他云上数据库 备份到云OSS上，用户只需几步配置，可以将跨云备份运行起来，成本可控，稳定性也有保障。'
        },
        {
          title: '场景3',
          num: '2',
          name: '云中备份场景',
          label:
            '行政事业单位由于数据保密性和安全备份要求等级远高于普通企业，给系统的信息和数据安全带来了 极大的挑战。数据库备份DBS可以帮助用户解决层出不穷的新型网络攻击和病毒的困扰，保障数据安全。'
        },
        {
          title: '场景4',
          num: '3',
          name: '上云备份场景',
          label:
            '数据库备份DBS可以帮助用户快速的为本地IDC数据库进行实时备份，让企业快速具备数据云灾备的能力，还可以随时进行任意时间点的数据恢复。'
        }
      ],
      frameworkImg: require('../../assets/images/pic/img-12.png')
    }
  },
  methods: {
    handleClick (tab, event) {
      console.log(tab, event)
    }
  }
}
</script>

<style scoped lang="scss">
.flex-grid {
  display: grid;
  grid-template-columns: 1fr;
  grid-row-gap: 20px;
  grid-column-gap: 20px;
}
.list-box {
}
</style>
